<template>
	<div class="infoContent contentPadding">
		<el-row class="infoRow">
			<el-col :span="19">
				<div style="display: block;">
					<template v-if="replayInfo.clubName">
						<span class="text-color">
							{{ replayInfo.clubName }}
						</span>
						<br />
					</template>
				</div>
				<div style="display: block;padding-top: 5px;">
					<template v-if="replayInfo.handId">
						<span class="text-color">
							手牌ID: {{ replayInfo.handId }}
						</span>
						<el-tag
							size="mini"
							class="copyButton"
							@click="copy(replayInfo.handId)"
						>
							复制
						</el-tag>
					</template>
				</div>
				<div v-if="handStatus === 2" class="showAbnormalImg">
					<el-image :src="abnormalImg" fit="contain"></el-image>
				</div>
			</el-col>
			<el-col :span="5"></el-col>
		</el-row>
		<el-row v-if="isShowSeatCount" class="flexCenterLeft seatCountRow">
			<el-col :span="2">
				<template v-if="replayInfo.maxSeatCount">
					<i class="el-icon-user-solid iconColor userIcon"></i>
					<span class="text-white-color seat-count-size">
						{{ replayInfo.maxSeatCount }}
					</span>
				</template>
			</el-col>
			<el-col :span="16" class="text-white-color scoreCol">
				<template v-if="replayInfo.gameTypeName">
					<span style="margin-right: 4px;">
						{{ replayInfo.gameTypeName }}
					</span>
					<span
						v-if="
							replayInfo.gameType === 2001 ||
								replayInfo.gameType === 2003
						"
					>
						{{ replayInfo.sbBlindScore }}
						/
						{{ replayInfo.bbBlindScore }}
						{{
							replayInfo.isShowStraddleAmount
								? `/ ${replayInfo.straddleAmount}`
								: ''
						}}
						<span
							v-if="replayInfo.isShowAnteScore"
							style="margin-left: 3px;"
						>
							{{ `(${replayInfo.anteScore})` }}
						</span>
					</span>
					<span v-else>
						{{ replayInfo.bbBlindScore }}
					</span>
				</template>
			</el-col>
			<el-col :span="6" class="flexCenterRight text-white-color">
				{{ replayInfo.handStartDateStr }}
			</el-col>
		</el-row>
	</div>
</template>

<script>
import list from '@/mixins/list'
export default {
	name: 'ReplayInfo',
	mixins: [list],
	props: {
		handStatus: {
			type: Number,
			default: 0
		},
		isShowSeatCount: {
			type: Boolean,
			default: false
		},
		replayInfo: {
			type: Object,
			default: () => {
				return {
					clubName: undefined,
					handId: undefined,
					gameTypeName: undefined,
					sbBlindScore: undefined,
					bbBlindScore: undefined,
					maxSeatCount: undefined,
					anteScore: undefined,
					isShowAnteScore: undefined,
					handStartDateStr: undefined
				}
			}
		}
	},
	data() {
		return {
			abnormalImg: require('@/assets/images/game/abnormal.png')
		}
	}
}
</script>
